---
layout: default-pages
---
<a id="backtotop_button"></a>

<div id="skewed-bg" >  
</div>

<section class="projects pt48">
    <div class="container">
        <!-- Loader -->
        <div class="row masonry-loader fadeOut">
            <div class="col-sm-12 text-center">
                <div class="spinner"></div>
            </div>
        </div>

        <!-- Projects -->
        <div class="row text-center">
            <div class="col-md-8 col-md-offset-2 text-center" >
                <h1> <strong>Student Projects</strong> </h1>
            </div>
        </div>
        <div class="row masonry masonryFlyIn fadeIn text-center">
            {% for project in site.data.projects %}
            <div class="col-md-4 col-sm-6 masonry-item fadeIn text-center flip-card">
                <div class="flip-card-inner text-center">
                    <div class="flip-card-front text-center">
                      <div>
                         <div class="flip-toggle-region">
                            <div class="student-project-name">{{ project.name }}</div>
                            <div class="student-project-info" >{{ project.info }}</div>
                         </div>
                         <div class="student-project-footer">
                            <div class="btn-group student-project-btn">
                               <button onclick="location.href='{{project.link}}'" type="button" class="btn-md btn-primary project-btn"> Source </button>
                               <button onclick="location.href='mailto:{{project.email}}'" type="button" class="btn-md btn-success project-btn"> Review </button>            
                            </div>
                            <div>
                               <hr class="student-project-hr">
                               <div class="student-project-footer-container">
                                  <img src="https://github.com/{{project.github}}.png" class="img-circle student-project-creator-img">
                                  <a href="https://github.com//{{project.github}}" target="_self" class="pull-right">{{project.creator}}</a>
                               </div>
                            </div>
                         </div>
                      </div>
                   </div>
                   <div class="flip-card-back text-center">
                       <img class="student-project-img" src="./img/projects/{{ project.img }}" >
                   </div>
                </div>
            </div>
            {% endfor %}
        </div>


        <div class="row mb80 mb-xs-0">
            <div align="center">
                <a class="btn btn-lg btn-filled" href="./">Back to the main page</a>
            </div>
        </div>
    </div>
</section>
